<template>
  <div class="headerBox">
    <div id="userMessage">
      <el-avatar :src="Root.img"></el-avatar>
      <span id="nameMsg">{{this.Root.name}}</span>
    </div>
    <div class="hiden-btn">
        <!-- <i class="el-icon-s-unfold icon-size" v-if="isShow"></i>
        <i class="el-icon-s-fold icon-size" v-else></i> -->
        <h2 id="title">餐饮管理系统</h2>
    </div>
    <div class="exitBtn">
        <i class="el-icon-switch-button exitIcon" @click="exitSystem()"></i>
    </div>
  </div>
</template>

<script>
import router from '@/router';
export default {
    data() {
      return {
        Root:{},
        //是否展开
        isCollapse: true,
        //展开图标切换
        isShow: true,
      };
    },

    methods: {
      //退出登录
      exitSystem(){
        this.$confirm('即将退出系统, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
            this.$axios.post("http://localhost:8888/hwy/cater/user/logout")
                .then(response=>{
                    if(response.data.code === 1 ){
                      this.$message({
                        message: '退出成功。',
                        type: 'success',
                      });
                      window.localStorage.removeItem("userInfo");
                      window.localStorage.removeItem("token");
                      router.push("/login")
                    }else{
                      this.$message({
                        message: '退出失败。',
                        type: 'error'
                      });
                    }
                })
                .catch(function (error) {
                    console.log(error)
                })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消退出'
          });          
        });
      },
      //信息赋值
      setMsg(){
        this.$axios.get("http://localhost:8888/hwy/cater/user/getById/"+ window.localStorage.getItem("id"))
                  .then((response) => {
                    // console.log("66:"+response)
                    this.Root = response.data.data;
                  })
      }
    },
    mounted(){
      this.setMsg();
    }

}
</script>

<style scoped>
@import '../assets/css/header.css'
</style>